This repository has been archived by the owner on Aug 1, 2022. It is now read-only.
refactor(build): replace rollup with webpack to make build faster #1710
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
We replace
rollup
withwebpack
to make our builds faster. While webpack is not faster without a cache it supports persistent caches in the file system which makes it significantly faster in development. Webpack is also significantly faster in watch mode.On my machine a rollup build and a webpack build without a cache take about 60 seconds. If a cache is present webpack builds the project in 8-9 seconds. When updating a file in watch mode rollup takes 7-8 seconds to rebuild. Webpack rebuilds the project in under a second.
Another thing to note is that in the past I spent multiple hours investigating issues with rollup and tweaking the config. None of this was necessary for webpack. We also gain more functionality, for example we can now leverage templating in the HTML document.
Some implementation notes:
package.json
ofsvelte-persistent-store
because of this issue. This only worked before because rollup itself was buggy.html-webpack-plugin
to dynamically buildpublic/index.html
and configure it for different environments.bundle.css
. CSS is now injected during runtime via JS.Follup-up: